<template>
    <div>
        <h4 class="font-weight-bold">风控API：导入风控主体</h4>
        
        <b-card no-body class="mb-2">
            <b-card-header>接口说明</b-card-header>
            <b-card-body>
                <h6>通过该接口，其他系统导入风控对象。风控对象数据字典定义，需在平台中已经存在。</h6>
            </b-card-body>
        </b-card>

        <b-card class="mb-4">
            <Row :gutter="32">
                <i-col span="24" class="demo-tabs-style2">
                <Tabs type="card">
                    <TabPane icon="ios-gear" label="传入参数">
                        <div>
                            <Row>                         
                                <i-col span="14">
                                    <h5 class="mb-4">真实数据案例</h5>
                                </i-col>
                            </Row>

                            <Row>
                                <i-col span="8">
                                    
                                </i-col>
                                <i-col span="14">
                                    <div class="result">
                                        <tree-view :data="realData" :options="{maxDepth: 3}"></tree-view>
                                    </div>
                                </i-col>
                            </Row>
                        </div>
                    </TabPane>
                    <TabPane icon="log-out" label="返回结果">
                        <div>
                            <Row>                         
                                <i-col span="14">
                                    <h5 class="mb-4">真实数据案例</h5>
                                </i-col>
                            </Row>

                            <Row>
                                <i-col span="8">
                                    
                                </i-col>
                                <i-col span="14">
                                    <div class="result">
                                        <tree-view :data="outData" :options="{maxDepth: 3}"></tree-view>
                                    </div>
                                </i-col>
                            </Row>
                        </div>
                    </TabPane>                    
                </Tabs>
                </i-col>
            </Row>
        </b-card>
    </div>
</template>

<style>
.ivu-tabs-nav .ivu-tabs-tab .ivu-icon{
    margin-right: 0;
}

h5{
    margin-bottom: 0;
    font-weight: bold;
    font-size: 14px;
}

.result {
    width: auto;
    height: 100%;
    border: 2px dashed gray;
    min-height: 480px;
    background-color: cornsilk;
    padding: 10px;
}
</style>


<script>
import VJstree from "vue-jstree";
export default {
    name: "OriginConsole",
    data() {
        return {
            data: [],
            oid: null,
            treeData: [],
            realData: [],
            outData:{}
        };
    },
    components: {

    },
    beforeCreate(){
        this.oid = this.$route.query.oid;
        // console.log('Console beforeCreate',this.oid);
    },
    created(){
        this.oid = this.$route.query.oid;
        // console.log('Console create',this.oid);
    },
    mounted() {
        this.loadOutDataExample();
        this.loadInterfaceData();
    },
    methods: {
        getOid(){
            return this.oid;    
        },
        loadInterfaceData(parentOid) {
            let self = this;
            let url = "/static/json/riskTool/api-newEntity-in.json";
            let params = {
                dtype: "json",
                exactlyMatch: "true",
                keyWord: "深圳市一体医疗科技有限公司",
                pageIndex: 1,
                pageSize: 10,
                province: ""
            };
            self.$http.get(url, params).then(res => {
                console.log(res);
                self.realData = res;
            });
        },
        loadOutDataExample(parentOid) {
            let self = this;
            let url = "/static/json/riskTool/api-newEntity-out.json";
            let params = {
                dtype: "json",
                exactlyMatch: "true",
                keyWord: "深圳市一体医疗科技有限公司",
                pageIndex: 1,
                pageSize: 10,
                province: ""
            };
            self.$http.get(url, params).then(res => {
                console.log(res);
                self.outData = res;
            });
        }
    },
    
    beforMount(){
        // console.log('Console',this.oid);
        this.oid = this.$route.query.oid;
    }
};
</script>

